var Tabview = {
	init:function(){
		//点击组织架构和标签 切换相应的内容
		var activeIndex = 0;
		var $contents = $(".tabContent");
		$("#tablist li a").removeClass("active");
		$contents.hide();
		$("#tablist li a").eq(activeIndex).addClass("active");
		$(".tabContent"+activeIndex).show();
		$("#tablist li").on("click",function(ev){
			$contents.hide();
			var index = $(this).index();
			$(".tabContent"+index).show();
		})
	}
};
var Tableview = {
		//初始化表格
		init: function(deptId) {
			var deptId = deptId||'';//选取左侧的dept树，切换表格
			var e, a, i;
			a = table1 = $("#userTable").mDatatable({
				data: {
					type: "remote",
					serverFiltering: true,
					source: {
						read: {
							//远程获取表格内容
			                url: 'https://www.easy-mock.com/mock/5b31e1be08040624bfc1c834/matrix_v1.0/getUserAll',
			                method: 'GET',
			                // custom headers
			                headers: { 'x-my-custom-header': 'some value', 'x-test-header': 'the value'},
			                params: {
			                    // 客户自定义参数
			                    generalSearch: '',
			                    EmployeeID: 1,
			                    deptId:deptId,
			                    token: 'token-value'
			                },
			                map: function(raw) {
			                	//ajax获取到远程的数据
			                    var dataSet = raw;
			                    if (typeof raw.data !== 'undefined') {
			                         dataSet = raw.data;
			                    }
			                    return dataSet;
			                },
			            }
					},
					pageSize: 30,
					serverPaging: true
				},
				layout: {
					theme: "default",
					class: "",
					scroll: true,
					height: 300,//表格默认的高度
					footer: !1,
					smoothScroll: {//滚动条
						  scrollbarShown: true
						},
				    spinner:{
				    	message: '正在加载数据中...'
				    }
				},
				toolbar:{
					items:{
						pagination:{
							pages:{
								desktop:{
									layout: 'default',
									pagesNumber: 6
								},
								tablet: {
									  layout: 'default',
									  pagesNumber: 6
									},
								mobile: {
									  layout: 'compact'
									}
							},
							navigation: {
							  prev: true,
							  next: true,
							  first: true,
							  last: true
							},
						}
					}
				},
				translate:{
					toolbar:{
						pagination:{
							items:{
								default: {
								  first: '首页',
								  prev: '前一页',
								  next: '下一页',
								  last: '末页',
								  more: '更多页',
								  input: '页数',
								  select: '请选择每页多少条'
								},
								info: '展示 {{start}} - {{end}} 条，共 {{total}} 条记录'
							}
						}
					}
				},
				sortable: !0,
				pagination: !0,
				search: {
					onEnter: false,
					input: $("#generalSearch")//查询过滤条件
				},
				columns: [{
					field: "RecordID",
					title: "#",
					width: 50,
					sortable: !1,
					textAlign: "center",
					selector: {
						class: "m-checkbox--solid m-checkbox--brand"
					}
				}, {
					field: "OrderID",
					title: "Order ID"
				}, {
					field: "ShipName",
					title: "Ship Name",
					responsive: {
						visible: "lg"
					}
				}, {
					field: "Currency",
					title: "Currency",
					width: 100
				}, {
					field: "ShipAddress",
					title: "Ship Address",
					responsive: {
						visible: "lg"
					}
				}, {
					field: "ShipDate",
					title: "Ship Date",
					type: "date",
					format: "MM/DD/YYYY"
				}, {
					field: "Latitude",
					title: "Latitude",
					type: "number"
				}, {
					field: "Status",
					title: "Status",
					template: function(e) {
						var a = {
							1: {
								title: "Pending",
								class: "m-badge--brand"
							},
							2: {
								title: "Delivered",
								class: " m-badge--metal"
							},
							3: {
								title: "Canceled",
								class: " m-badge--primary"
							},
							4: {
								title: "Success",
								class: " m-badge--success"
							},
							5: {
								title: "Info",
								class: " m-badge--info"
							},
							6: {
								title: "Danger",
								class: " m-badge--danger"
							},
							7: {
								title: "Warning",
								class: " m-badge--warning"
							}
						};
						return '<span class="m-badge ' + a[e.Status].class + ' m-badge--wide">' + a[e.Status].title + "</span>"
					}
				}, {
					field: "Type",
					title: "Type",
					template: function(e) {
						var a = {
							1: {
								title: "Online",
								state: "danger"
							},
							2: {
								title: "Retail",
								state: "primary"
							},
							3: {
								title: "Direct",
								state: "accent"
							}
						};
						return '<span class="m-badge m-badge--' + a[e.Type].state + ' m-badge--dot"></span>&nbsp;<span class="m--font-bold m--font-' + a[e.Type].state + '">' + a[e.Type].title + "</span>"
					}
				}, {
					field: "Actions",
					width: 110,
					title: "Actions",
					sortable: !1,
					overflow: "visible",
					template: function(e, a, i) {
						return '\t\t\t\t\t\t<div class="dropdown ' + (i.getPageSize() - a <= 4 ? "dropup" : "") + '">\t\t\t\t\t\t\t<a href="#" class="btn m-btn m-btn--hover-accent m-btn--icon m-btn--icon-only m-btn--pill" data-toggle="dropdown">                                <i class="la la-ellipsis-h"></i>                            </a>\t\t\t\t\t\t  \t<div class="dropdown-menu dropdown-menu-right">\t\t\t\t\t\t    \t<a class="dropdown-item" href="#"><i class="la la-edit"></i> Edit Details</a>\t\t\t\t\t\t    \t<a class="dropdown-item" href="#"><i class="la la-leaf"></i> Update Status</a>\t\t\t\t\t\t    \t<a class="dropdown-item" href="#"><i class="la la-print"></i> Generate Report</a>\t\t\t\t\t\t  \t</div>\t\t\t\t\t\t</div>\t\t\t\t\t\t<a href="#" class="m-portlet__nav-link btn m-btn m-btn--hover-accent m-btn--icon m-btn--icon-only m-btn--pill" title="View ">                            <i class="la la-edit"></i>                        </a>\t\t\t\t\t'
					}
				}]
			}), 
			i = a.getDataSourceQuery(), 
			$("#m_form_status").on("change", function() {
				a.search($(this).val(), "Status")
			}).val(void 0 !== i.Status ? i.Status : ""), 
			$("#m_form_type").on("change", function() {
				a.search($(this).val(), "Type")
			}).val(void 0 !== i.Type ? i.Type : ""), 
			$("#m_form_status, #m_form_type").selectpicker();
		
			a.on("m-datatable--on-goto-page",function(event,args){
				a.setDataSourceParam("page", args.page);
				a.setDataSourceParam("pages", args.pages);
				a.setDataSourceParam("perpage", args.perpage);
				a.setDataSourceParam("total", args.total);
				table1.load();
				//a.setDataSourceParam("generalSearch", args.generalSearch);
			})
		
		$("#addUser").on("click",function(){
			var records = a.getSelectedRecords();
			for(var i=0;i<records.length;i++){
				console.log($(records))
			}
		})
		},
		reloadByDept:function(deptId){
			init(deptId);
		}

};
var Treeview = {
	init: function() {
		$("#orgTree").jstree({
			core: {
				themes: {
					responsive: !1
				},
				check_callback: !0,
				data: {
					url: function(e) {
						return "https://www.easy-mock.com/mock/5b31e1be08040624bfc1c834/matrix_v1.0/getDepartTree"
					},
					dataType: "json" ,
					data: function(e) {
						return {
							parent: e.id
						}
					}
				}
			},
			types: {
				default: {
					icon: "fa fa-sitemap m--font-brand"
				},
				file: {
					icon: "fa fa-user  m--font-brand"
				}
			},
			state: {
				key: "demo3"
			},
			plugins: ["dnd", "state", "types"]
		});
		$('#orgTree').on("select_node.jstree", function (node,selected) {
			var deptId = selected.selected[0];
			table1.setDataSourceParam("query[deptId]", "11111111");
			table1.load();
		})
		
		$("#tagTree").jstree({
			core: {
				themes: {
					responsive: !1
				},
				check_callback: !0,
				data: {
					url: function(e) {
						return "https://www.easy-mock.com/mock/5b31e1be08040624bfc1c834/matrix_v1.0/getTagTree"
					},
					dataType: "json" ,
					data: function(e) {
						return {
							parent: e.id
						}
					}
				}
			},
			types: {
				default: {
					icon: "fa fa-tags m--font-brand"
				},
				file: {
					icon: "fa fa-user  m--font-brand"
				}
			},
			state: {
				key: "demo3"
			},
			plugins: ["dnd", "state", "types","contextmenu"]
		})
	}
};

jQuery(document).ready(function() {
	var table1,table2,tree1,tree2 = null;
	
	Treeview.init();
	Tableview.init();
	Tabview.init();//tab切换
});